import React from "react";


class Hello extends React.Component {
    state = {greeting: 'millet'}

    sayHello = () => {
        alert('Hello, ' + this.state.greeting)
    }

    render() {
        return <div>Hello Children</div>;
    }
}

export default class Input extends React.Component {
    state = {
        value: "",
    }

    inputRef = React.createRef();

    componentDidMount() {
        
    }

    onInputFoucus = () => {
        this.setState({
            value: "默认的初始值"
        })
    }

    onInputChange = (event) => {
        console.log(event.target.value)
        this.setState({value: event.target.value})
    }

    render() {
        const {value} = this.state;
        return <>
            <h2>{value}</h2>
            <input type="text" onFocus={this.onInputFoucus} onChange={this.onInputChange} value={value} />
            <Hello ref={this.inputRef} />
        </>
    }
}